<template>
    <div style="height: 1000px;overflow: scroll;">
        <h1>blog detail test</h1>
        <!-- @vue-skip -->
        <BlogDetail v-if="flagRef" :blog="blogRef" ></BlogDetail>
    </div>
</template>
<script setup lang='ts'>
    ////#region defineXxx
    //defineOptions({
        //name:
    //});

    //const props=defineProps({
        //propA:{
            //type:String,
            //required:true
        //},
        //propB:{
            //type:Number,
            //default:1
        //},
        //propC:{
            //type:String as PropType<MyType>,
            //required:true
        //},
    //});

    //const emit = defineEmits<{
        //event1:[para1:number,para2:string],
        //event2:[para1:number,para2:string],
    //}>();
    ////#endregion
import { onMounted, ref } from 'vue';
import BlogDetail from './BlogDetail.vue';
import { TypeApiBlogDetailI } from '~@/api/apiTypes';
import { getBlog } from '~@/api/blog';
    
const blogRef=ref<TypeApiBlogDetailI>();
console.log('in test');

const flagRef=ref(false);

onMounted(async ()=>{
    blogRef.value=await getBlog(1);
    console.log('in test onMounted');
    flagRef.value=true;
})

</script>
<style lang='less' scoped>
    
</style>